<template>
  <div class="index">
    <head-text titleText="合同管理"></head-text>
    <div class="list-content">
      <div class="filter-area">
        <Search :searchData="searchData" :searchItem="searchItem"></Search>
        <div>
          <el-button @click="add" plain type="success" size="mini"
            >添加合同</el-button
          >
        </div>
      </div>
      <div class="table-title">
        <span></span>
        <h5>合同列表</h5>
      </div>
      <custom-table
        :tableData="tableData"
        :tableListData="tableListData"
        :tableBtn="tableBtn"
        :currentData="currentData"
        @onPageChange="onPageChange"
        @onSizeChange="onSizeChange"
        @handleEdit="handleEdit"
        @handlPaySetting="handlPaySetting"
        @handleDelete="handleDelete"
        @downloadFile="downloadFile"
        @handleViewOther="handleViewOther"
        v-if="pageReset"
      ></custom-table>
    </div>
    <dialog-com :dialogObj="dialogObj" @reflash="getList"></dialog-com>
     <el-dialog
    title="合同下载"
    append-to-body
    :visible.sync="downloadVisible"
    :close-on-click-modal="false"
    width="600px"
  >
  模板名:
    <el-select
              v-model="downloadSelect"
              placeholder="请选择"
              style="width:200px;marginLeft:20px"
              size="mini"
            >
              <el-option
                v-for="data in DownLoadList"
                :key="data.id"
                :label="data.name"
                :value="data.id"
              >
              </el-option>
            </el-select>
             <span slot="footer" class="dialog-footer" >
      <el-button type="primary" @click="handleDownLoad" size="mini">确 定</el-button>
      <el-button @click="handleCancelDownLoad" size="mini">取 消</el-button>
    </span>
     </el-dialog>
  </div>
</template>
<script>
import customTable from "@c/table";
import Search from "@c/search";
import headText from "@c/headText";
import dialogCom from "./dialogCom";
import { CONTRACTSTATUSENUM, CONTRACTSTATUSLIST, ISNOTLIST } from "@u/wordbook";
// import Cookie from "@u/cookie";
import {
  getContractManagePageApi,
  getCustomerListApi,
  deleteContractManageApi,
  getDownLoadListApi,
  getDownLoadApi
} from "@s/api";
import { ISNEEDPAYLIST } from "@u/wordbook";
export default {
  name: "index",
  data() {
    return {
      nowPage: 1,
      total: 0,
      limit: 10,
      pageReset: true,
      searchItem: [],
      isNeedPayList: ISNEEDPAYLIST,
      searchData: {
        customerId: "",
        contractNumber: "",
        startTime: "",
        endTime: "",
        accountTransfer: "",
        status: ""
      },
      dialogObj: {
        id: "",
        title: "",
        show: false,
        form: {
          title: "",
          type: ""
        }
      },
      downloadVisible: false,
      downloadSelect: "",
      rowId: "",
      // downloadItmeId: "",
      DownLoadList: [],
      tableData: [],
      customerSelect: [],
      contractStatusList: CONTRACTSTATUSLIST,
      isNotList: ISNOTLIST,
      currentData: {}
    };
  },
  components: {
    headText,
    dialogCom,
    Search,
    customTable
  },
  created() {
    // form搜索
    this.searchItem = [
      {
        type: "select",
        label: "客户名称：",
        prop: "customerId",
        placeholder: "请选择",
        selectList: this.customerSelect
      },
      {
        type: "input",
        label: "合同编号",
        prop: "contractNumber",
        placeholder: "请输入合同编号"
      },
      {
        type: "select",
        label: "是否到账：",
        prop: "accountTransfer",
        placeholder: "请选择",
        selectList: this.isNotList
      },
      {
        type: "select",
        label: "合同状态：",
        prop: "status",
        placeholder: "请选择",
        selectList: this.contractStatusList
      }
    ];
    //  table表格
    this.tableListData = [
      { width: "50", label: "", type: "index" },
      { prop: "customerName", width: "", label: "客户名称", type: "a" },
      { prop: "contractNumber", width: "150px", label: "合同编号", type: "a" },
      { prop: "totalFee", width: "", label: "总金额(元)" },
      {
        prop: "status",
        width: "",
        label: "合同状态",
        type: "wordbook",
        wordbookList: this.getStatus
      },
      { prop: "createTime", width: "", type: "date", label: "创建时间" },
      { prop: "updateTime", width: "", type: "date", label: "更新时间" },
      { label: "操作", type: "btn", width: "150", fixed: "right" }
    ];
    // 按钮
    this.tableBtn = [
      {
        name: "编辑",
        btnType: "primary",
        handleFn: "handleEdit"
      },
      {
        name: "删除",
        btnType: "danger",
        handleFn: "handleDelete"
      },
      {
        name: "合同下载",
        btnType: "primary",
        handleFn: "downloadFile",
      },
      // {
      //   name: "合同下载",
      //   btnType: "primary",
      //   handleFn: "downloadFile",
      //   type: "isShow",
      //   isShowStatus: "status",
      //   isShowValue: "1"
      // },
      // {
      //   name: "合同下载",
      //   btnType: "primary",
      //   handleFn: "downloadFile",
      //   type: "isShow",
      //   isShowStatus: "status",
      //   isShowValue: "2"
      // }
    ];
  },
  mounted() {
    this.getCustomerSelect();
    this.getList();
  },
  methods: {
    // 缴费金额
    getStatus(val) {
      return CONTRACTSTATUSENUM[val];
    },
    downloadFile(row) {
      this.downloadVisible = true
      this.rowId = row.id
      getDownLoadListApi({id:row.id}).then(res => {
        this.DownLoadList = res;
      })
      // if (row.filePath) {
      //   const link = document.createElement("a");
      //   link.style.display = "none";
      //   link.href = row.filePath;
      //   link.target = "blank";
      //   // link.download = `${title}.pdf` // 下载的文件名
      //   document.body.appendChild(link);
      //   link.click();
      //   document.body.removeChild(link);
      // } else {
      //   this.$message({
      //     type: "warning",
      //     message: "还没有上传合同文件！"
      //   });
      // }
    },
    // changeDownLoad(val) {
    //   this.downloadItmeId = val
    //   console.log(val, this.downloadSelect)
    // },
    handleDownLoad() {
      this.downloadVisible = false
      getDownLoadApi({id:this.rowId,fileId:this.downloadSelect}).then(res => {
        window.location.href = res
      })
      this.downloadSelect = ''
    },
    // 查看
    handleViewOther(row) {
      this.dialogObj.id = row.id;
      this.dialogObj.read = true;
      this.dialogObj.show = true;
      this.dialogObj.title = "查看专利";
      this.dialogObj.form = row;
    },
    handleCancelDownLoad(){
       this.downloadVisible = false
      this.downloadSelect = ''
    },
    // 缴费设定
    handlPaySetting(row) {
      this.dialogPayObj.id = row.id;
      this.dialogPayObj.show = true;
      this.dialogPayObj.form = row;
      this.dialogPayObj.title = "缴费设定";
    },
    // 编辑
    handleEdit(row) {
      this.dialogObj.id = row.id;
      this.dialogObj.read = false;
      this.dialogObj.show = true;
      this.dialogObj.form = row;
      this.dialogObj.title = "编辑合同";
    },
    // 删除
    handleDelete(row) {
      this.$confirm("此操作将删除该合同?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        let json = row.id;
        deleteContractManageApi(json).then(() => {
          this.getList();
          this.$message({
            type: "success",
            message: "删除成功！"
          });
        });
      });
    },
    onPageChange(val) {
      this.nowPage = val;
      this.getList();
    },
    onSizeChange(val) {
      this.nowPage = 1;
      this.limit = val;
      this.getList();
    },
    // 搜索事件
    getDataList(val) {
      this.searchData = val;
      this.nowPage = 1;
      this.limit = 10;
      this.pageReset = false;
      this.$nextTick(() => {
        this.getList();
        this.pageReset = true;
      });
    },
    //获取列表
    getList() {
      let json = JSON.parse(JSON.stringify(this.searchData));
      json.page = this.nowPage;
      json.limit = this.limit;
      getContractManagePageApi(json).then(res => {
        this.tableData = res.list;
        this.currentData.total = res.total;
      });
    },
    // 获取客户列表
    getCustomerSelect() {
      getCustomerListApi().then(res => {
        let newCustomerList = [];
        res.forEach(item => {
          var newItem = {
            id: item.id,
            value: item.customerName
          };
          newCustomerList.push(newItem);
        });
        this.customerSelect = newCustomerList;
        this.searchItem.forEach(item => {
          if (item.prop == "customerId") {
            item.selectList = this.customerSelect;
          }
        });
      });
    },
    add() {
      this.dialogObj.id = "";
      this.dialogObj.read = false;
      this.dialogObj.show = true;
      this.dialogObj.title = "添加合同";
    },
    importPatent() {
      this.importPatentObj.id = "";
      this.importPatentObj.read = false;
      this.importPatentObj.show = true;
      this.importPatentObj.title = "导入专利信息";
    },
    importFee() {
      this.importFeeObj.id = "";
      this.importFeeObj.read = false;
      this.importFeeObj.show = true;
      this.importFeeObj.title = "导入缴费信息";
    }
  }
};
</script>
<style scoped lang="scss"></style>
